﻿@page "/contact"

<Seo Canonical="/contact" Title="Contact the Blazorise Team" Description="Contact us and learn more about our Blazorise components. We are here to help you with your product, licensing, renewals and other questions." />

<PageHeader>
    <Title>
        Get in touch
    </Title>
    <Description>
        <Paragraph>
            Want to learn more about our products and services?
        </Paragraph>
        <Paragraph>
            We’d love to chat.
        </Paragraph>
    </Description>
</PageHeader>

<Container>
    <Row>
        <Column ColumnSize="ColumnSize.Is8.OnWidescreen.Is12.OnDesktop" Margin="Margin.IsAuto.OnX">
            <Card Shadow="Shadow.Large">
                <Form>
                    <CardBody>
                        <Validations @ref="validationsRef" Mode="ValidationMode.Manual">
                            <Fields>
                                <Validation Validator="ValidationRule.IsNotEmpty">
                                    <Field ColumnSize="ColumnSize.IsHalf.OnDesktop">
                                        <FieldLabel RequiredIndicator>First name</FieldLabel>
                                        <FieldBody>
                                            <Addons>
                                                <Addon AddonType="AddonType.Start">
                                                    <AddonLabel>
                                                        <Icon Name="IconName.User" />
                                                    </AddonLabel>
                                                </Addon>
                                                <Addon AddonType="AddonType.Body">
                                                    <TextEdit @bind-Text="@User.FirstName" name="firstName" Placeholder="First Name..." aria-label="First Name..." />
                                                </Addon>
                                            </Addons>
                                        </FieldBody>
                                    </Field>
                                </Validation>
                                <Validation Validator="ValidationRule.IsNotEmpty">
                                    <Field ColumnSize="ColumnSize.IsHalf.OnDesktop">
                                        <FieldLabel RequiredIndicator>Last name</FieldLabel>
                                        <FieldBody>
                                            <Addons>
                                                <Addon AddonType="AddonType.Start">
                                                    <AddonLabel>
                                                        <Icon Name="IconName.Book" />
                                                    </AddonLabel>
                                                </Addon>
                                                <Addon AddonType="AddonType.Body">
                                                    <TextEdit @bind-Text="@User.LastName" name="lastName" Placeholder="Last Name..." aria-label="Last Name..." />
                                                </Addon>
                                            </Addons>
                                        </FieldBody>
                                    </Field>
                                </Validation>
                            </Fields>
                            <Validation Validator="ValidationRule.IsEmail">
                                <Field>
                                    <FieldLabel RequiredIndicator>Email address</FieldLabel>
                                    <FieldBody>
                                        <Addons>
                                            <Addon AddonType="AddonType.Start">
                                                <AddonLabel>
                                                    <Icon Name="Blazorise.Icons.FontAwesome.FontAwesomeIcons.Envelope" />
                                                </AddonLabel>
                                            </Addon>
                                            <TextEdit @bind-Text="@User.Email" name="email" Role="TextRole.Email" Placeholder="Email Here..." aria-label="Last Name..." />
                                        </Addons>
                                    </FieldBody>
                                </Field>
                            </Validation>
                            <Validation Validator="ValidationRule.IsNotEmpty">
                                <Field>
                                    <FieldLabel>Subject</FieldLabel>
                                    <FieldBody>
                                        <Addons>
                                            <Addon AddonType="AddonType.Start">
                                                <AddonLabel>
                                                    <Icon Name="Blazorise.Icons.FontAwesome.FontAwesomeIcons.Question" />
                                                </AddonLabel>
                                            </Addon>
                                            <Addon AddonType="AddonType.Body">
                                                <Select @bind-SelectedValue="@MessageSubject">
                                                    @foreach ( var subject in Subjects )
                                                    {
                                                        <SelectItem TValue="string" Value="@subject">@subject</SelectItem>
                                                    }
                                                </Select>
                                            </Addon>
                                        </Addons>
                                    </FieldBody>
                                </Field>
                            </Validation>
                            <Validation Validator="ValidationRule.IsNotEmpty">
                                <Field>
                                    <FieldLabel RequiredIndicator>What would you like to discuss?</FieldLabel>
                                    <FieldBody>
                                        <MemoEdit @bind-Text="@MessageBody" name="message" Rows="6" />
                                    </FieldBody>
                                </Field>
                            </Validation>
                            <Row>
                                <Column Padding="Padding.Is3.FromBottom">
                                    <Help>
                                        Blazorise needs the contact information you provide to contact you about our products and services. You may unsubscribe from these communications at anytime. For information on how to unsubscribe, as well as our privacy practices and commitment to protecting your privacy, check out our <Anchor To="privacy" Title="Link to Privacy Policy">Privacy Policy</Anchor>.
                                    </Help>
                                </Column>
                            </Row>
                            <Row>
                                <Validation Validator="@CaptchaInput.ValidateRobot">
                                    <Column ColumnSize="ColumnSize.IsHalf.OnDesktop">
                                        <CaptchaInput @bind-Value=NotARobot>
                                            <Feedback>
                                                <ValidationError />
                                            </Feedback>
                                        </CaptchaInput>
                                    </Column>
                                </Validation>
                                <Column ColumnSize="ColumnSize.IsHalf.OnDesktop">
                                    <Button Clicked="@SendEmail" Color="Color.Primary" Float="Float.End">Send Message</Button>
                                </Column>
                            </Row>
                        </Validations>
                    </CardBody>
                </Form>
            </Card>
        </Column>
    </Row>
</Container>